var flag=0;
var pageNo=1;
var pageSize=10;
var beginTime="";
var endTime="";
var pageNum;
var tempFlag=1;
var today = Date.parse(new Date());
var datePool=[];
var pvPool=[];
var uvPool=[];
var ipPool=[];
var outPvPool=[];
var averageTimePool=[];
var myChart;

//table 的ajax请求
function showList(){
    if(flag!==0){
        return;
    }
    flag=1;
    var beginTime=$("#startTime").val();
    var endTime=$("#endTime").val();
    var searchName=window.localStorage.searchName;
    ajax({
        url:"userAccess/pageHistoryStatistics",
        data:{
            startDate:beginTime,
            endDate:endTime,
            searchName:searchName,
        },
        success:function(data){
            if(data.success){
                
                flag=0;
                temp(data.data);
                [].slice.call(data.data.statistics).forEach(function(data){
                    datePool.push(data.date);
                    pvPool.push(data.pv);
                    uvPool.push(data.uv);
                    ipPool.push(data.ip);
                    outPvPool.push(data.outPv);
                    averageTimePool.push(data.averageTime);
                });
                eChart();
            }else{
                layer.msg(data.message)
            }
        }
    });
}

//请求成功后执行的table列表
function temp(data){
    document.getElementById('tbody').innerHTML = template("template",data);
    if(tempFlag===1){
        showData(data.summary);
    }
}

//展示总数据
function showData(data){
    $("#pv").html(data.pv);
    $("#uv").html(data.uv);
    $("#ip").html(data.ip);
    $("#outPv").html(data.outPv);
    $("#averageTime").html(data.averageTime);
}

//设置时间
function setReportTime(index) {
    var startTime=null;
    var endTime=null;
    switch (index){
        case 0:
            startTime=timeStamp2String(Number.parseFloat(today)-2592000000,"ymd")+" 00:00:00";
            endTime=timeStamp2String(Number.parseFloat(today)-86400000,"ymd")+" 23:59:59";
            break;
        case 1:
            startTime=timeStamp2String(Number.parseFloat(today)-604800000,"ymd")+" 00:00:00";
            endTime=timeStamp2String(Number.parseFloat(today)-86400000,"ymd")+" 23:59:59";
            break;
        case 2:
            startTime=timeStamp2String(Number.parseFloat(today)-86400000,"ymd")+" 00:00:00";
            endTime=timeStamp2String(Number.parseFloat(today)-86400000,"ymd")+" 23:59:59";
            break;
        case 3:
            startTime=timeStamp2String(today, "ymd")+" 00:00:00";
            endTime=timeStamp2String(today, "ymdhms");
            break;
    }
    $("#startTime").val(startTime);
    $("#endTime").val(endTime);
    showList();
}

//时间选择
function datePicker(){
    laydate.render({
        elem: '#endTime'
        , max: today
        ,showBottom: true
        ,value:timeStamp2String(today, "ymdhms")
        , type: 'datetime'
        , theme: 'molv'
    });
    laydate.render({
        elem: '#startTime'
        , max: today
        ,showBottom: true
        , theme: 'molv'
        , type: 'datetime'
        ,value:timeStamp2String(today, "ymd")+" 00:00:00"
    });
    showList();
}
//基本操作
function handle(){
    $(".dateTime").click(function () {
        var index=$(this).index(".dateTime");
        $(".dateTime").removeClass("btn-info");
        $(this).addClass("btn-info");
        setReportTime(index);
    });
    $("#inquire").click(function () {
        showList();
    });
    $("#changeStatistics").change(function(){
        var index=$(this).val();
        setEChart(index);
    })
}

function setEChart(index){
    var pool="";
    switch (Number.parseInt(index)){
        case 0:
            pool=pvPool;
            break;
        case 1:
            pool=uvPool;
            break;
        case 2:
            pool=ipPool;
            break;
        case 3:
            pool=outPvPool;
            break;
        case 4:
            pool=averageTimePool;
            break;

    }
    myChart.setOption({
        series: [{
            // 根据名字对应到相应的系列
            data: pool,
        }]
    });
}

function eChart(){
    // 指定图表的配置项和数据
    var option = {
        // legend: {
        //     data: ["流量统计"],
        //     top: '10px'
        // },
        grid: {
            left: '30px',
            right: '30px',
            bottom: '4%',
            top:'10%',
            containLabel: true
        },
        // tooltip: {
        //     trigger: 'axis'
        // },
        // title: {
        //     text: '流量数据',
        //     top: '10px',
        //     left: '20px'
        // },
        xAxis: {
            type: 'category',
            boundaryGap: false,
            data:datePool,
        },
        yAxis: {
            type: 'value'
        },
        series: [{
            name:"流量统计",
            type: 'line',
            data:pvPool
        }]
    };
    // 使用刚指定的配置项和数据显示图表。
    myChart.setOption(option);

}



$(document).ready(function () {
    // 基于准备好的dom，初始化echarts实例
    myChart = echarts.init(document.getElementById('main'));
    datePicker();
    handle();
});